var mcData = [{
  "thumb": "images/juzhao_1.jpg",
  "big": "images/juzhao_1.jpg"
}, {
  "thumb": "images/juzhao_2.jpg",
  "big": "images/juzhao_2.jpg"
}, {
  "thumb": "images/juzhao_3.jpg",
  "big": "images/juzhao_3.jpg"
}, {
  "thumb": "images/juzhao_4.jpg",
  "big": "images/juzhao_4.jpg"
}, {
  "thumb": "images/juzhao_5.jpg",
  "big": "images/juzhao_5.jpg"
}, {
  "thumb": "images/juzhao_1.jpg",
  "big": "images/juzhao_1.jpg"
}, {
  "thumb": "images/juzhao_2.jpg",
  "big": "images/juzhao_2.jpg"
}, {
  "thumb": "images/juzhao_3.jpg",
  "big": "images/juzhao_3.jpg"
}, {
  "thumb": "images/juzhao_4.jpg",
  "big": "images/juzhao_4.jpg"
}, {
  "thumb": "images/juzhao_5.jpg",
  "big": "images/juzhao_5.jpg"
}, {
  "thumb": "images/juzhao_1.jpg",
  "big": "images/juzhao_1.jpg"
}, {
  "thumb": "images/juzhao_2.jpg",
  "big": "images/juzhao_2.jpg"
}, {
  "thumb": "images/juzhao_3.jpg",
  "big": "images/juzhao_3.jpg"
}, {
  "thumb": "images/juzhao_4.jpg",
  "big": "images/juzhao_4.jpg"
}, {
  "thumb": "images/juzhao_5.jpg",
  "big": "images/juzhao_5.jpg"
}, {
  "thumb": "images/juzhao_1.jpg",
  "big": "images/juzhao_1.jpg"
}, {
  "thumb": "images/juzhao_2.jpg",
  "big": "images/juzhao_2.jpg"
}, {
  "thumb": "images/juzhao_3.jpg",
  "big": "images/juzhao_3.jpg"
}, {
  "thumb": "images/juzhao_4.jpg",
  "big": "images/juzhao_4.jpg"
}, {
  "thumb": "images/juzhao_5.jpg",
  "big": "images/juzhao_5.jpg"
}];

$(function() {

  var isLoading = false;
  var currentIdx = 0;

  function isNeerBottom() {
    if ($(window).scrollTop() + $(window).height() > $(document).height() - 20) {
      return true;
    }
    return false;
  }

  function getData(index) {
    // TODO: loading logic according to backend tech
    // You can use Ajax or pre-config for demo reason
    // here use pre-config method.
    var step = 5;
    var start = index * step;
    var end = start + step;
    if (!mcData[end]) {
      return null;
    }
    var data = {};
    var idx = 0;
    for (var i = start; i < end; i++) {
      var key = "p" + (++idx);
      data[key] = mcData[i];
    }
    return data;
  }

  function loading(index) {
    var data = getData(index);
    if (null == data) {
      $('.tooltip').hide();
      return;
    }
    var html = JZtemplate(data);
    $('.juzhao-gally').append(html);
    isLoading = false;
  }



  $('.juzhao-gally').click(function(evt){
    if(global.W < 1024){
      return;
    }
    var target = evt.target || evt.srcElement;
    var $target = $(target);
    if(!$target.data('pic')){
      $target = $target.parent();
    }
    if($target.data('pic')){
      var index = $target.index();
      ImageTour.show($target.get(0));
    }

  });

  $(window).on('mousewheel', function(event) {
    if (isLoading) {
      return;
    }
    if (event.deltaY < 0 && isNeerBottom()) {
      isLoading = true;
      loading(currentIdx++);
    }
  });
});
